page {
	//position: absolute;
	//width: 100%;
	//height: 100%;
	background-color: #fff !important;
	// overflow-x: hidden;
	// overflow-y: auto;
	//padding-bottom: 40rpx;
}

.title{
	
}
.ssk{
	display: flex;
	align-items: center;
	flex: 100%;
	margin: 0 32rpx;
	margin-top: -120rpx;

}
/* 搜索 */
.search-head {
	position: fixed;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	width: 100%;
	height: 200rpx;
	z-index: 10;
	flex-wrap: wrap;
	// flex-direction: column;
	// padding: 160rpx 20rpx 80rpx;
	/* #ifdef APP-PLUS */
	height: calc(180rpx + var(--status-bar-height));
	/* #endif */
	/* #ifdef MP */
	height: calc(280rpx + var(--status-bar-height));
	padding-top: var(--status-bar-height);
	/* #endif */
	background-color: #ffffff;
	.back {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 10%;
		height: 100%;
		text {
			width: 20rpx;
			height: 20rpx;
			border-left: 2rpx solid #555555;
			border-bottom: 2rpx solid #555555;
			transform: rotate(45deg);
		}
	}
	.search {
		flex: 1;
		display: flex;
		align-items: center;
		width: 76%;
		height: 60rpx;
		background-color: #f6f6f6;
		border-radius: 60rpx;
		padding: 0 4%;
		text {
			font-size: 34rpx;
			color: #c0c0c0;
		}
		input {
			width: 90%;
			height: 100%;
			font-size: 26rpx;
			color: #212121;
			margin-left: 10rpx;
		}
	}
	.cut {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 10%;
		height: 100%;
		text {
			font-size: 66rpx;
			color: #555555;
		}
	}
}


/* 筛选 */
.screen-info {
	position: fixed;
	left: 0;
	top: 100rpx;
	z-index: 11;
	/* #ifdef APP-PLUS */
	top: 150rpx;
	/* #endif */
	/* #ifdef MP */
	top: calc(210rpx + var(--status-bar-height));
	/* #endif */
	width: 100%;
	height: 100rpx;
	background-color: #ffffff;
	//价格 
	.check-color{
		color: #fe3b0f;
	}
	.screen-list {
		display: flex;
		align-items: center;
		width: 100%;
		height: 100%;
		.list {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 33%;
			height: 100%;
			text {
				font-size: 28rpx;
				 color: #333333;
			}
			.icon-sanjiao{
				font-size: 10rpx;
				margin: 4rpx 0;
				color: #333;
			}
			.change-color{
				color: #1D86B6;
			}
			.icon_z {
				font-size: 24rpx;
				transform: rotate(90deg) scale(0.7);
			}
			.icon_j {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
                width: 40rpx;
				height: 100%;
				.up {
					transform: rotate(-90deg) scale(0.7);
					margin-bottom: -15rpx;
					//margin-left: 8rpx;
				}
				.down {
					transform: rotate(90deg) scale(0.7);
				}
			}
			.icon_s {
				font-size: 24rpx;
				margin-left: 10rpx;
				// transform: scale(0.7);
			}
		}
		.action {
			text {
				color: #1D86B6;
			}
		}
	}
	// 弹出层
	.screen-popup {
		position: fixed;
		left: 0;
		top: 180rpx;
		/* #ifdef APP-PLUS */
		top: 230rpx;
		/* #endif */
		/* #ifdef MP */
		top: 280rpx;
		/* #endif */
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.3);
		// 综合
		.synthesize {
			padding: 0 20rpx;
			height: 200rpx;
			background-color: #f6f6f6;
			border-radius: 0 0 20rpx 20rpx;
			.list {
				display: flex;
				align-items: center;
				width: 100%;
				height: 80rpx;
				.check {
					display: inline-block;
					width: 20rpx;
					height: 10rpx;
					border-left: 4rpx solid $base;
					border-bottom: 4rpx solid $base;
					border-radius: 4rpx;
					transform: rotate(-45deg);
				}
				.title {
					font-size: 26rpx;
					color: #555555;
					margin-left: 20rpx;
				}
			}
		}
	}
}
/*空购物车  */ 
.nogoods{
	padding-top: 100rpx;
	.img{
		image{
			display: block;
			margin: auto;
		}
		
	}
	.to-list{
		margin-top: 20rpx;
		text-align: center;
		color: #1D86B6;
	}
}
/* 商品列表 */
.goods-data {
	width: 100%;
	margin-top: 40rpx;
	/* #ifdef APP-PLUS */
	margin-top: 300rpx;
	/* #endif */
	/* #ifdef MP */
	margin-top: calc(330rpx + var(--status-bar-height));
	/* #endif */
	.goods-list {
		// padding: 0 25rpx;
		// border-radius: 20rpx;
		
		overflow: hidden;		
		.list-view {			
			float: left;
			width: 49%;
			height: 520rpx;
			background-color: #ffffff;
			border-radius: 20rpx;
			margin-right: 2%;
			margin-bottom: 20rpx;
			overflow: hidden;
			box-shadow: 10rpx 10rpx 10rpx -5rpx #ccc;
			
			.pictrue{
				display: flex;
				justify-content: center;
				width: 330rpx;
				image{
					height: 330rpx;
				}
			}
									.two-omit1{
										color: #333333;
										font-size: 28rpx;
										width: 95%;
										white-space: nowrap; /* 不换行 */
										overflow: hidden; /* 超出隐藏 */
										text-overflow: ellipsis !important;
										font-size: 32rpx;
										font-weight: 700;
									}
			.title-tag{
				display: flex;
				height: 100rpx;
				padding: 20rpx 10rpx 0 0;
				margin-bottom: 15px;
				.tag{
					float: left;
					margin-right: 10rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
					white-space: normal;
					font-size: 12px;
					line-height: 40rpx;
					padding: 0 10px;
					font-weight: bold;
					text{
						color: #FFFFFF;
						padding: 0rpx 10rpx;
						border-radius: 6rpx;
						margin-right: 10rpx;
						background: #1D86B6;
						opacity: 1;
						font-size: 9px;
						font-family: "SourceHanSansCN";
						text-align: left;
					}
				}
			}	
			.price-info{
				display: flex;
				flex-wrap: wrap;
				align-items: center;
				justify-content: space-between;
				padding:0  10px;
				height: 10rpx;
				.price{
					display: flex;
					align-items: center;
					width: 100%;
					height: 30%;
					.selling-price{
						color: $price-clor;
						font-weight: 500;
						font-family: "SourceHanSansCN";
						text-align: left;
						font-size: 20rpx;
						font-weight: bold;
					}
					.original-price{
						font-size: 18rpx;
						text-decoration: line-through;
						color: #808080;
						margin-left: 10rpx;
					}
					.sales{
						font-size: 18rpx;
						color: #808080;
						margin-left: 30rpx;
					}
				}
				.user-price{
					display: flex;
					align-items: center;
					text{
						color: $price-clor;
					}
					.min{
						font-size: 24rpx;
					}
					.max{
						font-size: 24rpx;
					}
					.original-price{
						font-size: 20rpx;
						text-decoration: line-through;
						color: #bbbaba;
						margin-left: 10rpx;
					}
			
				}
			
			}	
			
			.thumb {
				width: 100%;
				//height: 300rpx;
				overflow: hidden;
				image {
                    height: 350rpx;
				}
			}
			
			.item {
				width: 100%;
				.title {
					padding: 20rpx;
					text {
						width: 100%;
						color: #212121;
						font-size: 26rpx;
						height: 64rpx;
					}
				}
				.price {
					padding: 0 20rpx;
					display: flex;
					.retail-price {
						display: flex;
						align-items: flex-end;
						width: 100%;
						height: 40rpx;
						.min {
							display: inline-block;
							font-size: 24rpx;
							color: $base;
							font-weight: bold;
							transform: scale(0.7);
						}
						.max {
							font-size: 28rpx;
							color: $base;
							font-weight: bold;
						}
						.tag {
							position: relative;
							background-color: $base;
							border-radius: 4rpx;
							margin-left: 10rpx;
							text {
								display: inline-block;
								color: #ffffff;
								font-size: 24rpx;
								transform: scale(0.7);
							}
						}
						.tag:before {
							position: absolute;
							left: -6rpx;
							top: 0;
							content: '';
							width: 0;
							height: 0;
							border-top: 0rpx solid transparent;
							border-right: 10rpx solid $base;
							border-bottom: 6rpx solid transparent;
						}
					}
					.vip-price {
						display: flex;
						align-items: flex-end;
						width: 100%;
						height: 40rpx;
						text-decoration: line-through;
						color: #999;
						font-size: 20rpx;
						.min {
							display: inline-block;
							// font-size: 20rpx;
							// color: #212121;
						}
						.max {
							// font-size: 24rpx;
							// color: #212121;
						}
					}
				}
				.sale-count{
					display: flex;
					align-items: flex-end;
					width: 100%;
					height: 40rpx;
					color: #999;
					font-size: 20rpx;
				}
			}
			
		}
		.list-view:nth-child(2n) {
			margin-right: 0;
		}
		// 列表
		.list-li {
			display: flex;
			align-items: center;
			width: 100%;
			height: 300rpx;
			background-color: #ffffff;

			.thumb {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 30%;
				height: 100%;
				image {
					width: 200rpx;
					height: 200rpx;
					border-radius: 10rpx;
				}
			}
			.item {
				display: flex;
				flex-direction: column;
				justify-content: center;
				width: 70%;
				height: 100%;
				border-bottom: 2rpx solid #f6f6f6;
				.title {
					padding: 20rpx;
					.two-omit1{
						color: #333333;
						// font-size: 28rpx;
						width: 95%;
						white-space: nowrap; /* 不换行 */
						overflow: hidden; /* 超出隐藏 */
						text-overflow: ellipsis !important;
						font-size: 32rpx;
						font-weight: 700;
					}
				}
				.itemP{
					display: flex;
					align-items: center;
					view{
						display: flex;
						flex: 1;
						 // color: #999999;
						 font-family: "Alibaba PuHuiTi 2.0";
						 font-size: 24rpx;
						 font-style: normal;
						 font-weight: 55 Regular;
						 line-height: normal;
						 margin: 0rpx 32rpx 8rpx 32rpx;
						 // white-space: nowrap; /* 不换行 */
						 // overflow: hidden; /* 超出隐藏 */
						 // text-overflow: ellipsis !important;
						
					}
				}
					.Tn{
					 color: #999999;
					 font-family: "Alibaba PuHuiTi 2.0";
					 font-size: 24rpx;
					 font-style: normal;
					 font-weight: 55 Regular;
					 line-height: normal;	
					  margin: 0rpx 32rpx 8rpx 32rpx;
					}
				.price {
					padding: 0 20rpx;
					.retail-price {
						display: flex;
						align-items: flex-end;
						width: 100%;
						height: 40rpx;
						.min {
							display: inline-block;
							font-size: 24rpx;
							color: $base;
							font-weight: bold;
							transform: scale(0.7);
						}
						.max {
							font-size: 32rpx;
							color: $base;
							font-weight: bold;
						}
						.tag {
							position: relative;
							background-color: $base;
							border-radius: 4rpx;
							margin-left: 10rpx;
							text {
								display: inline-block;
								color: #ffffff;
								font-size: 24rpx;
								transform: scale(0.7);
							}
						}
						.tag:before {
							position: absolute;
							left: -6rpx;
							top: 0;
							content: '';
							width: 0;
							height: 0;
							border-top: 0rpx solid transparent;
							border-right: 10rpx solid $base;
							border-bottom: 6rpx solid transparent;
						}
					}
					.vip-price {
						display: flex;
						align-items: flex-end;
						width: 100%;
						height: 40rpx;
						.min {
							display: inline-block;
							font-size: 24rpx;
							color: #212121;
						}
						.max {
							font-size: 24rpx;
							color: #212121;
						}
					}
				}
			}
		}
	}
}
.basis-lg {
	padding-top: 0;
	border-radius: 20rpx 0 0 20rpx;
	flex-basis: 80% !important;
	.serve {
		/* #ifdef APP-PLUS */
		padding-top: 50rpx;
		/* #endif */
		/* #ifdef MP */
		padding-top: 140rpx;
		/* #endif */
		padding-left: 20rpx;
		padding-right: 20rpx;
		background-color: #ffffff;
		.title {
			display: flex;
			align-items: center;
			width: 100%;
			height: 80rpx;
			text {
				color: #212121;
				font-size: 28rpx;
			}
		}
		.serve-list {
			display: flex;
			flex-wrap: wrap;
			padding: 20rpx 0;
			.list {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 30%;
				height: 60rpx;
				border-radius: 60rpx;
				margin-right: 4%;
				background-color: #f6f6f6;
				text {
					color: #555555;
					font-size: 24rpx;
				}
			}
			.list:nth-child(3n) {
				margin-right: 0;
			}
			.action {
				// background-color: $rgba-03;
				border: 2rpx solid #1D86B6;
				
				text {
					color: #1D86B6;
				}
			}
		}
	}
	.price-screen {
		padding: 0 4%;
		background-color: #ffffff;
		margin-top: 20rpx;
		.title {
			display: flex;
			align-items: center;
			width: 100%;
			height: 80rpx;
			text {
				color: #212121;
				font-size: 28rpx;
			}
		}
		.price-section {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: 80rpx;
			input {
				width: 180rpx;
				height: 50rpx;
				border-radius: 50rpx;
				font-size: 24rpx;
				color: #555555;
				background-color: #f6f6f6;
			}
			text {
				display: flex;
				width: 60rpx;
				height: 2rpx;
				background-color: #f6f6f6;
				margin: 0 20rpx;
			}
		}
	}
	.operation-btn {
		position: absolute;
		left: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 4%;
		width: 100%;
		height: 100rpx;
		background-color: #ffffff;
		.btn {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 46%;
			height: 70rpx;
			background-color: #ffffff;
			border: 2rpx solid #f6f6f6;
			border-radius: 70rpx;
			// margin-left: 5%;
			text {
				color: #212121;
				font-size: 26rpx;
			}
		}
		.creal{
			width: 30%;
			color:  #1D86B6;
			border: 2rpx solid  #1D86B6;
			text{
				color:  #1D86B6;
			}
		}
		.action {
			width:66%;
			background-color: #1D86B6;
			text {
				color: #ffffff;
			}
		}
	}
}
